<template>
  <div>
    <group label-width="4.5em" label-margin-right="2em" label-align="right">
      <cell title="姓 名：" :value="userName" value-align="left"></cell>
      <cell title="员工号：" :value="staffId" value-align="left"></cell>
      <cell title="部门：" :value="departmentName" value-align="left"></cell>
      <x-input title="手机号：" keyboard="number" is-type="china-mobile" placeholder="输入11位手机号码" v-model="phone"></x-input>
    </group>
    <br>
    <div style="padding:10px;">
      <x-button @click.native="submit()" type="primary">提 交</x-button>
    </div>
    <toast v-model="messageTosat" type="text">修改失败，请重新提交</toast>    
  </div>
</template>

<script>
  import { GroupTitle, Group, Cell, XInput, XButton, Toast } from 'vux'

  export default {
    components: {
      Group,
      GroupTitle,
      Cell,
      XInput,
      XButton,
      Toast
    },
    data () {
      var ms_staffId = localStorage.getItem('ms_staffId')
      return {
        staffId: ms_staffId,
        phone: '',
        detail: [],
        departmentName: '',
        userName: '',
        messageTosat: false
      }
    },
    mounted: function () {
    this.getUserDetail()
    },
    methods: {
      getUserDetail: function () {
        var self = this
        self.$ajax({
          method: 'get',
          url: '../wx/user/detail',
          params: {
            staffId: self.staffId
          }
        })
        .then(function (res) {
          self.detail = res.data[0]
          self.userName = self.detail.userName
          self.departmentName = self.detail.departmentName
          self.phone = self.detail.phone
        })
        .catch(function (err) {
          console.log(err)
        })
      },
      submit: function () {
        var self = this
        self.$ajax({
          method: 'get',
          url: '../wx/user/update/phone',
          params: {
            staffId: self.staffId,
            newPhone: self.phone
          }
        })
        .then(function (res) {
          if (res.message == 'SUCCESS') {
            self.$router.push('../tabbar/myinfo')
          } else {
            self.messageTosat = true
          }
        })
        .catch(function (err) {
          console.log(err)
        })
      }
    }
  }
</script>
